8e:I[903690,["/chat-static/_next/static/chunks/0cxp4op0m1119.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2druaqheowhl8.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/00c0bu24wji78.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2o82vp45o81e5.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2lvmzw_lbp-jf.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2gyzl_dalq47j.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0sex0gcwdsmjy.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0wkge2f3s0f22.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1ggzqs8-kdl22.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0rrc9lo-bkkh5.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1j5k8gvtw8gdc.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/42mjea_hxrwdp.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0a4mwgsvj_bqu.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1t2vvxh4dupb4.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3-pn4n4eze_76.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1ovy71-w2povn.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/05vo5x924wz4s.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/37rh4z4c9595s.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0hms8tz4_m27c.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/332d35_pah0kr.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/18k2gve12j479.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1j9njtdk43kba.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1idn80rtjcasd.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0-pi40mz7bqkr.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2nl7z8xw_3un6.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1mo0iq2atp502.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3-9165k65ag24.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/326ugcf3n9jpc.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/27d-e_mtrq80p.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/046fqcvlcxx_w.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0h9h3jzy0z9y4.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1pr8_b61w-4h9.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/16ot-3kwt24hs.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3usbrh3-7_sgf.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/31wev-p231v4h.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/23crm4bdujzj_.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3crl-ybxc1u5r.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/24jtal64lwnrj.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/02buq-_-_ooco.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3ec3uj44xo5pu.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/013l2updr-opq.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0xfnk8tx-4t2w.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz"],"ExplicitChatIdProvider"] 8f:I[838238,["/chat-static/_next/static/chunks/0cxp4op0m1119.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2druaqheowhl8.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/00c0bu24wji78.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2o82vp45o81e5.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2lvmzw_lbp-jf.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2gyzl_dalq47j.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0sex0gcwdsmjy.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0wkge2f3s0f22.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1ggzqs8-kdl22.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0rrc9lo-bkkh5.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1j5k8gvtw8gdc.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/42mjea_hxrwdp.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0a4mwgsvj_bqu.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1t2vvxh4dupb4.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3-pn4n4eze_76.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1ovy71-w2povn.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/05vo5x924wz4s.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/37rh4z4c9595s.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0hms8tz4_m27c.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/332d35_pah0kr.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/18k2gve12j479.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1j9njtdk43kba.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1idn80rtjcasd.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0-pi40mz7bqkr.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/2nl7z8xw_3un6.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1mo0iq2atp502.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3-9165k65ag24.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/326ugcf3n9jpc.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/27d-e_mtrq80p.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/046fqcvlcxx_w.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0h9h3jzy0z9y4.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/1pr8_b61w-4h9.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/16ot-3kwt24hs.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3usbrh3-7_sgf.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/31wev-p231v4h.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/23crm4bdujzj_.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3crl-ybxc1u5r.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/24jtal64lwnrj.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/02buq-_-_ooco.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/3ec3uj44xo5pu.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/013l2updr-opq.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz","/chat-static/_next/static/chunks/0xfnk8tx-4t2w.js?dpl=dpl_4BYYgQnxqPxJ8RzVzJJWxdrauQKz"],"SWRDataProvider"] 90:T2492,[V0_FILE]typescriptreact:file="currency-converter.tsx" isQuickEdit="true" "use client" import { useState, useEffect } from "react" import { motion } from "framer-motion" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { Dialog, DialogContent, DialogTrigger } from "@/components/ui/dialog" import { ScrollArea } from "@/components/ui/scroll-area" import { ArrowUpDown, ChevronRight, Search } from "lucide-react" const fiatCurrencies = [ { code: "USD", name: "US Dollar", flag: "🇺🇸" }, { code: "EUR", name: "Euro", flag: "🇪🇺" }, { code: "GBP", name: "British Pound", flag: "🇬🇧" }, { code: "JPY", name: "Japanese Yen", flag: "🇯🇵" }, { code: "AUD", name: "Australian Dollar", flag: "🇦🇺" }, { code: "CAD", name: "Canadian Dollar", flag: "🇨🇦" }, { code: "CHF", name: "Swiss Franc", flag: "🇨🇭" }, { code: "CNY", name: "Chinese Yuan", flag: "🇨🇳" }, { code: "INR", name: "Indian Rupee", flag: "🇮🇳" }, { code: "SGD", name: "Singapore Dollar", flag: "🇸🇬" }, { code: "NZD", name: "New Zealand Dollar", flag: "🇳🇿" }, { code: "MXN", name: "Mexican Peso", flag: "🇲🇽" }, { code: "BRL", name: "Brazilian Real", flag: "🇧🇷" }, { code: "SEK", name: "Swedish Krona", flag: "🇸🇪" }, { code: "NOK", name: "Norwegian Krone", flag: "🇳🇴" }, ] const cryptoCurrencies = [ { code: "BTC", name: "Bitcoin", icon: "₿" }, { code: "ETH", name: "Ethereum", icon: "Ξ" }, { code: "USDT", name: "Tether", icon: "₮" }, { code: "BNB", name: "Binance Coin", icon: "BNB" }, { code: "XRP", name: "Ripple", icon: "XRP" }, { code: "ADA", name: "Cardano", icon: "ADA" }, { code: "SOL", name: "Solana", icon: "SOL" }, { code: "DOT", name: "Polkadot", icon: "DOT" }, { code: "DOGE", name: "Dogecoin", icon: "Ð" }, { code: "AVAX", name: "Avalanche", icon: "AVAX" }, ] export default function CurrencyConverter() { const [amount, setAmount] = useState(1) const [fromCurrency, setFromCurrency] = useState("USD") const [toCurrency, setToCurrency] = useState("EUR") const [convertedAmount, setConvertedAmount] = useState(null) const [exchangeRate, setExchangeRate] = useState(null) const [isCrypto, setIsCrypto] = useState(false) const [isLoading, setIsLoading] = useState(false) const [error, setError] = useState(null) useEffect(() => { const fetchExchangeRate = async () => { setIsLoading(true) setError(null) try { const response = await fetch( `https://free.currconv.com/api/v7/convert?apiKey=YOUR_API_KEY&q=${fromCurrency}_${toCurrency}&compact=ultra`, ) if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`) } const data = await response.json() const rate = data[`${fromCurrency}_${toCurrency}`] if (!rate) { throw new Error("Exchange rate not found in response") } setExchangeRate(rate) setConvertedAmount(amount * rate) } catch (error) { console.error("Error fetching exchange rate:", error) setError("Failed to fetch exchange rate. Using fallback rate.") // Fallback to a static exchange rate const fallbackRate = 1.1 // Example fallback rate setExchangeRate(fallbackRate) setConvertedAmount(amount * fallbackRate) } finally { setIsLoading(false) } } fetchExchangeRate() }, [amount, fromCurrency, toCurrency]) const handleSwapCurrencies = () => { setFromCurrency(toCurrency) setToCurrency(fromCurrency) } return (

Currency Converter

Convert

{ const value = Number.parseFloat(e.target.value) if (!isNaN(value)) { setAmount(Math.max(0, Math.min(1000000, value))) } }} onWheel={(e) => { e.preventDefault() const delta = e.deltaY > 0 ? -1 : 1 setAmount((prevAmount) => { const newAmount = prevAmount + delta return Math.max(0, Math.min(1000000, newAmount)) }) }} step="1" min="0" max="1000000" className="w-full text-5xl font-light bg-transparent border-none text-center focus:ring-0 focus:outline-none text-white placeholder-gray-400" placeholder="0" />

{isLoading ? (

) : ( <> {error &&

{error}

}

{convertedAmount !== null ? convertedAmount.toFixed(isCrypto ? 8 : 2) : "..."} {toCurrency}

1 {fromCurrency} = {exchangeRate !== null ? exchangeRate.toFixed(isCrypto ? 8 : 4) : "..."}{" "} {toCurrency}

)}

) } function CurrencySelect({ value, onChange, label, isCrypto }) { const [open, setOpen] = useState(false) const [search, setSearch] = useState("") const currencies = isCrypto ? cryptoCurrencies : fiatCurrencies const filteredCurrencies = currencies.filter( (currency) => currency.code.toLowerCase().includes(search.toLowerCase()) || currency.name.toLowerCase().includes(search.toLowerCase()), ) return ( ) } 84:["$","$L8e",null,{"chatId":"wPdRCJBeVIz","children":["$","$L8f",null,{"data":{"@\"active-block\",\"wPdRCJBeVIz\",":{"id":"jPJ5aJ5Ibw9","messageId":"gCAY0YcSDyHDZST6gNGmwSHT6UuPrVEZ","source":"$90","language":"typescriptreact","type":"code-project","closed":true,"meta":{"id":"premium-currency-converter","type":"code-project","project":"premium-currency-converter"},"hasSourceBeenEdited":false,"forkedFromBlockId":"$undefined"},"@\"chat:vm-mode\",\"wPdRCJBeVIz\",":false,"":null},"children":"$L91"}]}]

About

Tags

Share

About

Tags

Share

More from dollargill

More Templates Like This